﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MaxLengthDemo.aspx.cs" Inherits="WebAppDemo.MaxLengthDemo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
<%--    <script src="Scripts/jquery1.4.js"></script>--%>
    <script src="Scripts/jquery-1.8.3.js"></script>
    <script src="Scripts/maxlength.js"></script>
    <script type="text/javascript">
         $(function () {
            $('textarea.limited').maxlength({
                'feedback': '#charsLeft .charsLeft', 'useInput': true
            });
         });
         

         function setShowLength(obj, maxlength, id) {
             var rem = maxlength - obj.value.length;
             var wid = id;
             if (rem < 0) {
                 rem = 0;
             }
             document.getElementById(wid).innerHTML = "还可以输入" + rem + "字数";
         }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <textarea id="Textarea1" textmode="MultiLine" rows="5" class="limited"></textarea>
         还可输入<span id="charsLeft01" >140</span>字
         <textarea id="txtSpeech" textmode="MultiLine" rows="5" class="limited"></textarea>
         <input type="hidden" name="maxlength" value="2" />
         还可输入<span class="charsLeft">140</span>字
    </div>
        <input name="title" type="text" size="50" value="" maxlength="15" onkeyup="javascript:setShowLength(this, 15, 'cost_tpl_title_length');">
        <span class="red" id="cost_tpl_title_length"></span>
        
        <input name="title" type="text" size="50" value="" maxlength="15" onkeyup="javascript:setShowLength(this, 15, 'Span1');">
        <span class="red" id="Span1"></span>
    </form>
</body>
</html>
